<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html>
<html>
<head>
<jsp:include page="./header.jsp" />

<%@page import="java.util.*"%>
<%@page import="util.*"%>
<%@page import="domain.*"%>  
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">

<%
	List<Schedule> schedules = (List<Schedule>) request.getAttribute("schedules");
	String message = (String) request.getAttribute("message");
%>
<title>Get Schedule</title>

	<script type="text/javascript">
	  
		window.onload = function(){
			if("<%=message%>"!="" && "<%=message%>"!="null"){
				alert("<%=message%>");
			}
		}
		
		function showMap(url, id){
			document.forms["showMap"+id].method = "get";
			document.forms["showMap"+id].action = "./"+url;
			document.forms["showMap"+id].submit();
		}
		
		function updateDelStatus(url, id){
			document.forms["updateStatus"+id].method = "post";
			document.forms["updateStatus"+id].action = "./"+url;
			document.forms["updateStatus"+id].submit();
		}
		
	</script>
</head>
<body>
	<form id="homeSubmit">
		<input type="hidden" name="todo" value="home"/>
	</form>
	<div data-role="page" data-theme="a" id="mainPage">

	<div data-role="header" data-position="inline">
		<h1>Schedule</h1>
		<a href="javascript:homeSubmit('Login')" data-icon="home" class="ui-btn-right" data-iconpos="notext"></a>
	</div><!-- /header -->

	<div data-role="content" >
			<% 
				if(schedules!=null){
			%>
			<ul data-role="listview" data-inset="true" data-theme="a">
			<%
				for(int i=0; i<schedules.size(); i++){
					Schedule schedule = schedules.get(i);
			%>
					<li>
						<a href="#missions<%= schedule.getId()%>" data-transition="slide">
							<%=schedule.getRoute()%> - <%= DateUtil.getDDMMYYYYFromDate(schedule.getDate(), 0) %>
							(<%=schedule.getStatus().equals(ScheduleStatus.completed)? schedule.getStatus(): schedule.getNoOfCompletedMissions()+"/"+schedule.getNoOfAllMissions()%>)
						</a>
					</li>
				<%} %>
			</ul>
			<%}else{ %>
				<script>
					alert("There is no any schedule!!");
				</script>
			<%} %>
		
		<br/>
		
	</div><!-- /content -->

	<div data-role="footer" class="ui-bar">
			<h4></h4>
	</div><!-- /footer -->
	</div><!-- /page -->
	
	<!-- Mission Pages -->
		<% 
			if(schedules!=null){
		%>
		<%
			for(int i=0; i<schedules.size(); i++){
				Schedule schedule = schedules.get(i);
				List<Mission> missions = schedule.getMissions();
		%>
				<div data-role="page" id="missions<%=schedule.getId()%>" data-theme="a">
			
				<div data-role="header" data-position="inline">
					<h1><%=schedule.getRoute()%> - <%= DateUtil.getDDMMYYYYFromDate(schedule.getDate(), 0) %></h1>
					<a href="javascript:homeSubmit('Login')" data-icon="home" class="ui-btn-right" data-iconpos="notext"></a>
				</div><!-- /header -->
			
				<div data-role="content">
					<ul data-role="listview">
						<%for(int j=0; j<missions.size(); j++){ 
							Mission mission = missions.get(j);
						%>
						<li>
							<a href="#detail<%= mission.getId() %><%= mission.getPriority()%>" data-transition="pop" data-rel="dialog">
								<%=mission.getPriority() %>. <%=mission.getToPOS().getName() %>
								<i>(<%=mission.getStatus() %>)</i>			
							</a>	
						</li>
						<%} %>
					</ul>		
					<form id="showMap<%=schedule.getId() %>">
						<input type="hidden" value="<%=schedule.getId() %>" name="scheduleId" id="scheduleId"/>
					</form>
					<br/>
					<div data-role="button" onclick="showMap('GetTraffic', <%=schedule.getId() %>)">Show On Map</div>
				</div><!-- /content -->
			
				<div data-role="footer">
					<h4></h4>
				</div><!-- /footer -->
				</div><!-- /page -->
			<%} %>
		<% } %>
	
	
	<!-- Mission Detail Pages -->
		<% 
			if(schedules!=null){
		%>
		<%
			for(int i=0; i<schedules.size(); i++){
				Schedule schedule = schedules.get(i);
				List<Mission> missions = schedule.getMissions();
		%>
				<%for(int j=0; j<missions.size(); j++){ 
					Mission mission = missions.get(j);
					List<Envelope> envelopes = mission.getEnvelopes();
				%>
				<div data-role="page" id="detail<%= mission.getId() %><%=mission.getPriority()%>" data-theme="a">
	
				<div data-role="header">
					<h1><%=mission.getToPOS().getName() %></h1>
				</div><!-- /header -->
				<div data-role="content">
					<ul data-role="listview" >
						<li>From: <%=mission.getFromPOS().getName() %></li>
						<li>To: <%=mission.getToPOS().getName() %></li>
						<li>Priority: <%=mission.getPriority()%></li>
						<li>Type: <%=mission.getDevType() %></li>
						<li>Status: <%=mission.getStatus() %> <%= mission.getStatus().equals(MissionStatus.complete)? " - "+DateUtil.getDDMMYYYYHHMMFromTimestamp(mission.getCompleteTime()):""%></li>
						<%for(int k=0; k<envelopes.size(); k++){ 
							Envelope envelope = envelopes.get(k);
						%>
							<li>Envelope - <%=envelope.getEnvelopId() %> #(<%=envelope.getNoOfProduct() %>)</li>
						<%} %>
					</ul>		
					<%if(schedule.isReachDuedDate() && mission.getStatus().equals(MissionStatus.incomplete)){ %>	
						<form id="updateStatus<%=mission.getId() %>">
							<input type="hidden" value="<%=mission.getId() %>" name="missionId" id="missionId"/>
							<input type="hidden" value="<%=schedule.getId() %>" name="scheduleId" id="scheduleId"/>
						</form>
						<br/>
							<div data-role="button" data-theme="a" onclick="updateDelStatus('GetSchedule', <%=mission.getId() %>)">Update Delivery Status</div>
					<%} %>
				</div><!-- /content -->
				</div><!-- /page -->
					
				<%} %>
			<%} %>
		<% } %>
</body>
</html>